<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<body>
  <input type="button" value="男" id="btn">
  <input type="text" id="texts" disabled="disabled">
  <select name="" id="list">
    <option value="bj">北京</option>
    <option value="sh">上海</option>
  </select>
  <script>
    var btn = document.getElementById("btn");
    var texts = document.getElementById("texts");
    var list = document.getElementById("list");
    var opts = document.querySelectorAll("#list option");
    // value属性
    console.log(btn.value);//男
    console.log(opts[0].innerText);//北京
    console.log(opts[1].value);//sh
    // 更改input的value属性
    btn.value = "ni"
    // 有些属性属性值和属性名是一样的
    console.log(texts.disabled);//true
    console.log(btn.disabled);//false
    btn.disabled = true
    opts[1].selected = true
  </script>
</body>
</html>